<template>
  <view class="bl-su">
    <view class="bl-su-box">
      <view class="bl-content">
        恭喜您抽中<br />
        {{num}}积分
      </view>
      <view class="bl-time">{{time}}s后自动关闭</view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      time:3,
      num:0
    };
  },
  created() {
    let timeO=setInterval(()=>{
      this.time--
      if(this.time<=0){
        clearInterval(timeO)
        this.$emit("blessingBagClone")
      }
    },1000)
  },
  methods: {
    init(num){
      this.time=3;
      this.num=num;
    }
  },
}
</script>

<style lang="scss">
@function tovmin($rpx){//$rpx为需要转换的字号
  @return #{$rpx * 100 / 750}vmin;
}
.bl-su{
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.bl-su-box{
  width: tovmin(667);
  height: tovmin(671);
  background-image: url("https://wechat-pictures-1301970825.file.myqcloud.com/wxapp/answeringHomework/tankuang_bg.png");
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.bl-content{
  width:  tovmin(506);
  height: tovmin(292);
  background-color: #FFFDEC;
  border-radius: tovmin(8);
  border: tovmin(6) solid #DFCF89;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: tovmin(242);
  flex-direction: column;
  font-size: tovmin(60);
  color: #008442;
  font-weight: 600;
}
.bl-time{
  margin-top: tovmin(36);
  font-size: tovmin(38);
  color: #A7A7A7;
}
</style>
